
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
        <table border="0" width="100%" height="100%" cellspacing="0" cellpadding="0">
            <tr valign="top">
                <td height="65" background="images/header_bg06.png" style="vertical-align: top; padding-top: 4px;" >
                    <img border="0" src="images/Fire_Protection_Department_KPIs.png" width="385" height="35" vspace=5 hspace=10></td>
            </tr>
        </table>
</nav>



<div class="wrapper">
    <section class="row">

        <bg-splitter orientation="horizontal">
            <bg-pane min-size="135" style=" width: 25%;"><div class="pane-container">
                <div id="left_area" class="col-sm-12" ng-controller="TreeCtrl">
                    <div class="panel panel-info">
                        <div class="panel-heading"><b> Org List</b></div>

                        <div id="tree-panel-body" class="panel-body">
                            <form class="form" role="form">
                                <div class="form-group">
                                    <!--<label for="searchField">Search</label>-->
                                    <!-- <input name="search" placeholder="Filter...">-->
                                    <div class="right-inner-addon">
                                        <i id="treeFilterIcon" class="glyphicon glyphicon-filter" data-ng-click="clearFilter2()"
                                           data-toggle="tooltip" data-placement="right" title="Reset"
                                                ></i>
                                        <input name="search" class="form-control" id="searchField" placeholder="Filter..."
                                               ng-model="searchText">
                                    </div>
                                    <button id="btnResetSearch" style="display: none" >&times;</button>
                                </div>
                            </form>
                            <div>
                                <div id="tree">
                                </div>
                            </div>
                        </div>
                        <!-- </div>-->
                    </div>
                </div>
            </div></bg-pane>
            <bg-pane  style=" left: 25%;" min-size="300">

                    <div id="center_area" class="col-sm-12">
                <div class="panel panel-info" ng-controller="tablectrl">
                    <div class="panel-heading">
                        <div class="btn-group" >
                            <button  type="button" class="btn btn-primary"  data-ng-click="leftTreeToggleCollapse()" id="collapseButton">
                                <span id="collapseIcon" class="glyphicon glyphicon-chevron-left" style="color: #428BCA" href="">
                                </span>
                            </button>
                            <ul class="dropdown-menu" style="max-height: 400px; overflow-y: auto">

                            </ul>
                        </div>
                        <b ng-bind-html="orgText | unsafe"></b>
                    </div>
                    <div class="panel-body">

                        <form id="ExcelForm" method="post" action="exportExcel.htm" target="TheWindow">
                            <input type="hidden" name="htmltable" value="" />
                            <input type="hidden" name="fileName" value="exported_excel" />
                        </form>


                        <div class="span6 yearQuarterControlBar" ng-controller="ControlBarCtrl">

                            <div class="pull-right">
                                <div id="YearDropDownDiv" class="btn-group">
                                    <button  type="button" class="btn btn-primary" data-toggle="dropdown">{{year}} <b class="caret"></b></button>
                                    <ul class="dropdown-menu" style="max-height: 400px; overflow-y: auto">
                                        <li><a href="" ng-repeat="year2 in yearList"
                                               ng-click=" year2.$selected = !year2.$selected;setSelectedYear(year2.key)">{{year2.key}}</a></li>
                                    </ul>
                                </div>

                                <!-- Button Quarter Group-->
                                <div class="btn-group">
                                    <button type="button" data-ng-click="setSelectedQuarter(item, $event)"
                                            class="btn btn-primary" ng-model="radioModel" btn-radio="'Q1'" value="1"> Q1
                                    </button>
                                    <button type="button" data-ng-click="setSelectedQuarter(item, $event)"
                                            class="btn btn-primary" ng-model="radioModel" btn-radio="'Q2'" value="2"> Q2
                                    </button>
                                    <button type="button" data-ng-click="setSelectedQuarter(item, $event)"
                                            class="btn btn-primary" ng-model="radioModel" btn-radio="'Q3'" value="3"> Q3
                                    </button>
                                    <button type="button" data-ng-click="setSelectedQuarter(item, $event)"
                                            class="btn btn-primary" ng-model="radioModel" btn-radio="'Q4'" value="4"> Q4
                                    </button>
                                </div>

                                <button type="button" class="btn btn-primary" ng-click="exportExcel_BtnClick()">Excel</button>
                            </div>


                        </div>
                        <div class="span6 firetable">
                            <!-- <div class="well well-sm"><strong>Org Code:</strong> {{ orgText }} </div>-->
                            <div id="myTableContainer" style="padding-left: 30px; padding-right: 11px">

                            </div>

                        </div>
                    </div>
                </div>
            </div></bg-pane>

        </bg-splitter>


    </section>
</div>

